<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>出行服务</title>
    <link rel="stylesheet" href="./icon/iconfont.css">
    <link rel="stylesheet" href="./css/sevice.css">
</head>
<body> 
    <!-- 头部 -->
    <header>       
        <span>出行服务</span>
        <a href="#">
             <span class="iconfont icon-dangqianhuihua"></span>
        </a>      
    </header>

    <!-- 图文1 -->    
    <div class="content1">     

        <div class="left">
            <span>餐饮特产</span>
            <span class="bluef">沿途享用美味佳肴.</span>
            <a href="#">
                <img src="./images/left-pic.png" alt="">
            </a>
        </div>
   

        <div class="right">
            <div class="top">
                <div class="top-font">
                  <span>自营产品</span>
                  <span class="yellowf">旅途中家的味道</span>   
                </div>                
                 <a href="#">
                      <img src="./images/right-top.png" alt="">
                </a>                

            </div>

            <div class="bottom">
                <div class="bottom-font">
                  <span>配送站</span>
                  <span class="blue2f">一切为您服务</span>   
                </div>
                <a href="#">
                  <img src="./images/right-bottom.png" alt="">
               </a>   

            </div>
           
        </div>
    </div>

    <!-- 图文2轮播 -->
    
        <div class="banner1">
            <div class="banner1-font">
              <span>铁路商城</span>
              <span class="purplef">乡村振兴&nbsp;帮扶先行</span>   
            </div>
            <a href="#">
              <img src="./images/banner-right.png" alt="">
           </a>   

        </div>

        <div class="banner2">
            <a href="#">
              <img src="./images/banner-left.png" alt="">
           </a> 
           <div class="banner2-font">
              <span>酒店预订</span>
              <span class="bluef1">让您的旅途更舒心</span>  
              <span class="bluef2">海量酒店/入住保障/一站式火酒服务</span>  
            </div>

        </div>

<!-- 图文内容2 -->
        <div class="content2">     

            <div class="left">
                <div class="font">
                    <div class="left-font">
                      <span>休息厅~接送</span>
                      <span class="bluef3">旅途享受贴心服务</span>
                      <span class="iconfont icon-shafa">专属休息室</span>
                      <span class="iconfont icon-aixin">专属服务</span>
                      <span class="iconfont icon-tongzhi">登车提醒</span>
                    </div>                
                     <a href="#">
                          <img src="./images/box.png" alt="">
                    </a>                
    
                </div>
            </div>
            
            <div class="right">
                <span>中铁手机卡</span>
                <span class="purplef2">立即申请&nbsp;尽享优惠</span>
                <a href="#">
                    <img src="./images/card.png" alt="">
                </a>
            </div>

        </div>

    <!-- 2张图片 -->
    <div class="pic2">     
        <div class="left">
            <a href="#">
                <img src="./images/threecar.png" alt="">
            </a>
        </div>
        <div class="right">
            <a href="#">
                <img src="./images/train.png" alt="">
            </a>
        </div>
    </div>

    <!-- 页脚 -->
    <div class="footer">     

        <div class="left">
            <span>旅游服务</span>
            <span class="yellowff">咨询随时获取</span>
            <a href="#">
                <img src="./images/computer.png" alt="">
            </a>
        </div>

        <div class="right">
            <span>约车服务</span>
            <span class="blueff">方便快捷</span>
            <a href="#">
                <img src="./images/car.png" alt="">
            </a>
        </div>

    </div>

</body>
</html>